<template>
  <div>
    <h3>修改答辩日期与地点</h3>
    <a-alert class="card" message="请注意，说明中若有学位信息未上报提示，请通知学生由学生自己填写上报信息！学位信息上报入口为：学位管理→学位信息上报→学位信息录入" type="error" style="margin-bottom: 20px;" />
    <a-form :form="form">
        <a-row :gutter="48">
            <!-- <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}">
            <a-form-item label="所属院系">
              <a-input disabled v-decorator="[
                'yxmc',
                {
                  rules: [{ required: true, message: '请选择所属院系!' }]
                }
              ]"/>
            </a-form-item>
          </a-col>
          <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}" >
            <a-form-item label="所属专业">
              <a-input disabled v-decorator="[
                'zymc',
                {
                  rules: [{ required: true, message: '请选择所属专业!' }]
                }
              ]" />
            </a-form-item>
          </a-col>
          <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}">
              <a-form-item label="学生类别">
                <a-input disabled v-decorator="[
                'xslbmc',
                {
                  rules: [{ required: true, message: '请选择学生类别!' }]
                }
              ]" />
              </a-form-item>
          </a-col>
          <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}">
            <a-form-item label="年度"  >
              <a-input disabled v-decorator="[
                'dbnd',
                {
                  rules: [{ required: true, message: '请选择年度!' }]
                }
              ]" />
            </a-form-item>
          </a-col> -->
          <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}">
            <a-form-item label="答辩日期" :required="true">
              <a-form-item style="width: 50%;float: left;">
              <a-date-picker v-decorator="[
                'dbrq',
                {
                  rules: [{ required: true, message: '请选择答辩日期!' }]
                }
              ]" style="width: 100%;" />
              </a-form-item>
              <a-form-item style="width: 50%;float: left;">
              <a-select v-decorator="[
                'dbrqswhxw',
                {
                  rules: [{ required: true, message: '请选择时间段!' }]
                }
              ]" :allowClear="true" showSearch optionFilterProp="children" >
                <a-select-option v-for="i in TYPE0370" :key="i.id" :value="i.code">{{ i.name }}</a-select-option>
              </a-select>
            </a-form-item>
            </a-form-item>
          </a-col>
          <a-col :sm="{span:12}" :lg="{span:12}" :xl="{span:6}">
            <a-form-item label="答辩地点">
              <a-input v-decorator="[
                'dbdd',
                {
                  rules: [{ required: true, message: '请输入答辩地点!' }]
                }
              ]"  placeholder="请输入..." />
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
  </div>
</template>

<script>
import moment from 'moment';
import { mapState } from 'vuex'

const selectArr = [
  'TYPE0370' //上午或下午
]

export default {
  props: {
    editVisible: {
      default: false
    },
    data:{
      default:function(){
        return {
          yxmc:'',
          zymc:'',
          xslbmc:'',
          dbnd:'',
          dbrq:'',
          dbdd:'',
          dbrqswhxw:''
        }
      }
    }
  },
  data () {
    return {
      form: this.$form.createForm(this)
    }
  },
  computed: {
    ...mapState({
      TYPE0370: state => state.app['TYPE0370'], // 上午或下午
    })
  },
  watch:{
    data(val){
      if (val.id) {
        this.form.setFieldsValue({
          yxmc:val.yxmc,
          zymc:val.zymc,
          xslbmc:val.xslbmc,
          dbnd:val.dbnd,
          dbrq:moment(val.dbrq,'YYYY/MM/DD'),
          dbdd:val.dbdd,
          dbrqswhxw:val.dbrqswhxw
        })
      }
    }
  },
  created() {
    selectArr.forEach(v => {
      this.$store.dispatch('app/setDictionary', v)
    })
  },
  mounted(){
    let val = this.data;
    if (val.id) {
      this.form.setFieldsValue({
        yxmc:val.yxmc,
        zymc:val.zymc,
        xslbmc:val.xslbmc,
        dbnd:val.dbnd,
        dbrq:moment(val.dbrq,'YYYY/MM/DD'),
        dbdd:val.dbdd,
        dbrqswhxw:val.dbrqswhxw
      })
    }
  }
}
</script>
